<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"  />
    <meta charset="utf-8" />
    <title>标签管理</title>

    <meta name="description" content="" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />

    <!-- bootstrap & fontawesome -->
    <link rel="stylesheet" href="/admin/assets/css/bootstrap.min.css" />
    <link rel="stylesheet" href="/admin/assets/font-awesome/4.5.0/css/font-awesome.min.css" />
    <!-- page specific plugin styles -->
    <link rel="stylesheet" href="/admin/assets/css/sweetalert.css" />
    <link rel="stylesheet" href="/admin/assets/css/chosen.min.css" />
    <!-- text fonts -->
    <link rel="stylesheet" href="/admin/assets/css/fonts.googleapis.com.css" />

    <!-- ace styles -->
    <link rel="stylesheet" href="/admin/assets/css/ace.min.css" class="ace-main-stylesheet" id="main-ace-style" />

    <!--[if lte IE 9]>
    <link rel="stylesheet" href="/admin/assets/css/ace-part2.min.css" class="ace-main-stylesheet"/>
    <![endif]-->
    <link rel="stylesheet" href="/admin/assets/css/ace-skins.min.css" />
    <link rel="stylesheet" href="/admin/assets/css/ace-rtl.min.css" />

    <!--[if lte IE 9]>
    <link rel="stylesheet" href="/admin/assets/css/ace-ie.min.css"/>
    <![endif]-->

    <!-- inline styles related to this page -->

    <!-- ace settings handler -->
    <script src="/admin/assets/js/ace-extra.min.js"></script>

    <!-- HTML5shiv and Respond.js for IE8 to support HTML5 elements and media queries -->

    <!--[if lte IE 8]>
    <script src="/admin/assets/js/html5shiv.min.js"></script>
    <script src="/admin/assets/js/respond.min.js"></script>
    <![endif]-->
</head>

<body class="no-skin">
<div id="navbar" class="navbar navbar-default     ace-save-state">
    <div class="navbar-container ace-save-state" id="navbar-container">
        <button type="button" class="navbar-toggle menu-toggler pull-left" id="menu-toggler" data-target="#sidebar">
            <span class="sr-only">Toggle sidebar</span>

            <span class="icon-bar"></span>

            <span class="icon-bar"></span>

            <span class="icon-bar"></span>
        </button>

        <div class="navbar-header pull-left">
            <a href="/admin/index/page" class="navbar-brand">
                <small>
                    <i class="fa fa-leaf"></i>
                    Blog 后台管理
                </small>
            </a>
        </div>

        <div class="navbar-buttons navbar-header pull-right" role="navigation">
            <ul class="nav ace-nav">
                <li class="light-blue dropdown-modal">
                    <a data-toggle="dropdown" href="#" class="dropdown-toggle">
                        <img class="nav-user-photo" src="/admin/assets/images/avatars/user.png" alt="Jason's Photo" />
                        <span class="user-info">
									<small>欢迎,</small>
									管理员
								</span>

                        <i class="ace-icon fa fa-caret-down"></i>
                    </a>

                    <ul class="user-menu dropdown-menu-right dropdown-menu dropdown-yellow dropdown-caret dropdown-close">

                        <li>
                            <a href="#">
                                <i class="ace-icon fa fa-power-off"></i>
                                退出
                            </a>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
    </div><!-- /.navbar-container -->
</div>

<div class="main-container ace-save-state" id="main-container">
    <script type="text/javascript">
        try{ace.settings.loadState('main-container')}catch(e){}
    </script>

    <div id="sidebar" class="sidebar                  responsive                    ace-save-state">
        <script type="text/javascript">
            try{ace.settings.loadState('sidebar')}catch(e){}
        </script>

        <div class="sidebar-shortcuts" id="sidebar-shortcuts">
            <div class="sidebar-shortcuts-large" id="sidebar-shortcuts-large">
                <button class="btn btn-success">
                    <i class="ace-icon fa fa-signal"></i>
                </button>

                <button class="btn btn-info">
                    <i class="ace-icon fa fa-pencil"></i>
                </button>

                <button class="btn btn-warning">
                    <i class="ace-icon fa fa-users"></i>
                </button>

                <button class="btn btn-danger">
                    <i class="ace-icon fa fa-cogs"></i>
                </button>
            </div>

            <div class="sidebar-shortcuts-mini" id="sidebar-shortcuts-mini">
                <span class="btn btn-success"></span>

                <span class="btn btn-info"></span>

                <span class="btn btn-warning"></span>

                <span class="btn btn-danger"></span>
            </div>
        </div><!-- /.sidebar-shortcuts -->

        <ul class="nav nav-list">
            <li class="">
                <a href="/admin/index/page">
                    <i class="menu-icon fa fa-home"></i>
                    <span class="menu-text"> 首 页 </span>
                </a>

                <b class="arrow"></b>
            </li>
            <li class="">
                <a href="/admin/article/page" >
                    <i class="menu-icon fa fa-pencil-square-o"></i>
                    <span class="menu-text"> 文章管理 </span>
                </a>
            </li>
            <li class="">
                <a href="/admin/category/page" >
                    <i class="menu-icon fa fa-list"></i>
                    <span class="menu-text"> 分类管理 </span>
                </a>
            </li>
            <li class="active">
                <a href="/admin/tag/page" >
                    <i class="menu-icon fa fa-tags"></i>
                    <span class="menu-text"> 标签管理 </span>
                </a>
            </li>
            <li class="">
                <a href="/admin/article/comment/page" >
                    <i class="menu-icon fa fa-comments-o"></i>
                    <span class="menu-text"> 评论管理 </span>
                </a>
            </li>

            <li class="">
                <a href="/admin/comment/page">
                    <i class="menu-icon fa fa-envelope"></i>
                    <span class="menu-text"> 留言管理 </span>
                </a>
            </li>

            <li class="">
                <a href="/admin/view/page">
                    <i class="menu-icon fa fa-eye"></i>
                    <span class="menu-text"> 访问记录 </span>
                </a>
            </li>

            <li class="">
                <a href="/admin/log/page">
                    <i class="menu-icon fa fa-book"></i>
                    <span class="menu-text"> 日志查看 </span>
                </a>
            </li>

            <li class="">
                <a href="/admin/setting/page">
                    <i class="menu-icon fa fa-cog"></i>
                    <span class="menu-text"> 设 置 </span>
                </a>
            </li>
        </ul><!-- /.nav-list -->

        <div class="sidebar-toggle sidebar-collapse" id="sidebar-collapse">
            <i id="sidebar-toggle-icon" class="ace-icon fa fa-angle-double-left ace-save-state" data-icon1="ace-icon fa fa-angle-double-left" data-icon2="ace-icon fa fa-angle-double-right"></i>
        </div>
    </div>

    <div class="main-content">
        <div class="main-content-inner">
            <div class="page-content">
                <div class="row">
                    <!--列表部分-->
                    <div class="col-md-12" id="dataTableDiv">
                        <h3 class="header smaller lighter blue">访问记录</h3>

                        <div class="clearfix">
                            <div class="pull-right tableTools-container"></div>
                        </div>
                        <!-- div.table-responsive -->

                        <!-- div.dataTables_borderWrap -->
                        <div>
                            <table id="table" class="table table-striped table-bordered table-hover"style='text-align: center'>
                                <thead>
                                <td><span>id</span></td>
                                <td><span>标签名称</span></td>
                                <td><span>创建时间</span></td>
                                <td><span>含有此标签文章的个数</span></td>
                                <td><span>操作</span></td>
                                </thead>
                            </table>
                            <!--修改标签-->
                            <div class="modal fade" id="tagUpdateModal">
                                <div class="modal-dialog">
                                    <div class="modal-content">
                                        <div class="modal-header">
                                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                                                &times;
                                            </button>
                                            <h4 class="modal-title">
                                                修改标签
                                            </h4>
                                        </div>
                                        <div class="modal-body">
                                            <form class="form-horizontal" onsubmit="submitTagUpdate()">
                                                <div class="form-group">
                                                    <label class="col-md-4 control-label no-padding-right" >标签名称</label>
                                                    <div class="col-md-6">
                                                        <input  type="text" id="nameUpdate" required="required">
                                                    </div>
                                                </div>
                                                <div class="modal-footer" style="text-align: center ">
                                                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                                                    </button>
                                                    <input type="submit" class="btn btn-primary">
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- PAGE CONTENT ENDS -->
            </div><!-- /.col -->
        </div><!-- /.row --><!-- /.row -->
    </div><!-- /.page-content -->
</div>
</div><!-- /.main-content -->

<div class="footer">
    <div class="footer-inner">
        <div class="footer-content">
						<span class="bigger-120">
							<span class="blue bolder">ZhouJianGuo's Blog</span>
							 &copy; 2019
						</span>
        </div>
    </div>
</div>

<a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
    <i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
</a>
</div><!-- /.main-container -->

<!-- basic scripts -->

<!--[if !IE]> -->
<script src="/admin/assets/js/jquery-2.1.4.min.js"></script>

<!-- <![endif]-->

<!--[if IE]>
<script src="/admin/assets/js/jquery-1.11.3.min.js"></script>
<![endif]-->
<script type="text/javascript">
    if('ontouchstart' in document.documentElement) document.write("<script src='/admin/assets/js/jquery.mobile.custom.min.js'>"+"<"+"/script>");
</script>
<script src="/admin/assets/js/bootstrap.min.js"></script>
<!-- page specific plugin scripts -->
<script src="/admin/assets/js/jquery.ui.touch-punch.min.js"></script>

<!-- ace scripts -->
<script src="/admin/assets/js/ace-elements.min.js"></script>
<script src="/admin/assets/js/ace.min.js"></script>

<!-- page specific plugin scripts -->
<script src="/admin/assets/js/jquery.dataTables.min.js"></script>
<script src="/admin/assets/js/jquery.dataTables.bootstrap.min.js"></script>
<script src="/admin/assets/js/dataTables.buttons.min.js"></script>
<script src="/admin/assets/js/buttons.flash.min.js"></script>
<script src="/admin/assets/js/buttons.html5.min.js"></script>
<script src="/admin/assets/js/buttons.print.min.js"></script>
<script src="/admin/assets/js/buttons.colVis.min.js"></script>
<script src="/admin/assets/js/dataTables.select.min.js"></script>
<script src="/admin/assets/js/sweetalert-dev.js"></script>

<script src="/admin/ckeditor/ckeditor.js"></script>
<!--page sources scripts-->
<script type="text/javascript">
    var dataTable = $('#table').DataTable( {
        jQueryUI: true,
        lengthMenu: [ 10, 20, 30 ],
        serverSide:true,
        searching:false,
        autoWidth:false,
        ajax:{
            url:'/admin/tag/list',
            type:'get'
        },
        columns:[
            {data:'id'},
            {data:'name'},
            {data:'createBy'},
            {data:'number'}
        ],
        columnDefs:[
            {
                targets:4,
                render:function (data,type,row,meta) {
                    var html="<div class='hidden-sm hidden-xs action-buttons'>\
                    <a class='green' onclick='initTagUpdateModal("+JSON.stringify(row)+")'><i class='ace-icon fa fa-pencil bigger-130'></i></a>"
                    if(row.number>0){
                        html+="<a class='grey' ><i class='ace-icon glyphicon glyphicon-remove bigger-130'></i></a>"
                    }else{
                        html+="<a class='red' onclick='submitTagDelete("+row.id+")'><i class='ace-icon glyphicon glyphicon-remove bigger-130'></i></a>"
                    }
                    html+="</div>"
                    return html;
                }
            }
        ],
        language:{
            "decimal":        "",
            "emptyTable":     "空数据",
            "info":           "当前为第 _START_ 到 _END_ 条数据,总共 _TOTAL_ 条数据",
            "infoEmpty":      "当前显示 0 条数据",
            "infoFiltered":   "(总共 _MAX_ 条数据)",
            "infoPostFix":    "",
            "thousands":      ",",
            "lengthMenu":     "显示 _MENU_ 条数据",
            "loadingRecords": "加载中...",
            "processing":     "处理中...",
            "search":         "查找:",
            "zeroRecords":    "未能找到相关数据",
            "paginate": {
                "first":      "首页",
                "last":       "末页",
                "next":       "下一页",
                "previous":   "上一页"
            },
            "aria": {
                "sortAscending":  ": activate to sort column ascending",
                "sortDescending": ": activate to sort column descending"
            }
        }
    } );

    //初始化修改
    function initTagUpdateModal(item){
        $("#tagUpdateModal").attr("value",item.id)
        $("#nameUpdate").val(item.name)
        $("#tagUpdateModal").modal('show')
    }
    //提交修改
    function submitTagUpdate(){
        event.preventDefault()
        var data={};
        data.name=$("#nameUpdate").val()
        $.ajax({
            data:JSON.stringify(data),
            url:'/admin/tag/'+$("#tagUpdateModal").attr("value"),
            type:'put',
            contentType:'application/json',
            dataType:'json',
            success:function (result) {
                if(result.code==200){
                    swal("提示","修改标签信息成功！","success")
                    $("#tagUpdateModal").modal("hide")
                    dataTable.ajax.reload();
                }
            }
        })
    }
    //提交删除
    function submitTagDelete(id) {
        swal({
                title: '注意',
                text: '即将删除id为：' + id + '的标签！',
                type: 'warning',
                showCancelButton: true,
                confirmButtonColor: "#DD6B55",
                confirmButtonText: "删除！",
                cancelButtonText: "emmm 算了吧··",
                closeOnConfirm: false,
                closeOnCancel: true
            },
            function (isConfirm) {
                if (isConfirm) {
                    $.ajax({
                        type: 'delete',
                        url: '/admin/tag/' + id,
                        dataType: 'json',
                        success: function (result) {
                            if (result.code == 200) {
                                swal("提示", "删除id为：" + id + "的标签成功！", "success");
                                dataTable.ajax.reload();
                            }
                        }
                    })
                }
            })
    }
</script>
</body>
</html>
